<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>
    <div id="main" style="width:800px;height: 350px;"></div>
</body>
</html>
<script src="${pageContext.request.contextPath}/Resource/js/jquery-3.3.1.js" type="text/javascript"></script>
<script src="${pageContext.request.contextPath}/Resource/echarts/echarts.common.min.js"></script>
<link href="${pageContext.request.contextPath}/image/logo.png" rel="Shortcut Icon">
<script>
    var chartDom = document.getElementById('main');
    var myChart = echarts.init(chartDom);
    var option;

    var mySum1;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '股票型'
        },
        success : function(data) {   //成功返回数据
            mySum1=data;
        }
    });

    var mySum2;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '混合型'
        },
        success : function(data) {   //成功返回数据
            mySum2=data;
        }
    });

    var mySum3;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '封闭式'
        },
        success : function(data) {   //成功返回数据
            mySum3=data;
        }
    });

    var mySum4;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '指数型'
        },
        success : function(data) {   //成功返回数据
            mySum4=data;
        }
    });

    var mySum5;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '债券型'
        },
        success : function(data) {   //成功返回数据
            mySum5=data;
        }
    });

    var mySum6;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '货币型'
        },
        success : function(data) {   //成功返回数据
            mySum6=data;
        }
    });

    var mySum7;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '理财型'
        },
        success : function(data) {   //成功返回数据
            mySum7=data;
        }
    });

    var mySum8;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '保本型'
        },
        success : function(data) {   //成功返回数据
            mySum8=data;
        }
    });

    var mySum9;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: '结构型'
        },
        success : function(data) {   //成功返回数据
            mySum9=data;
        }
    });

    var mySum10;
    $.ajax({
        url : "/Anonymous/selectFundType.do",//请求地址
        dataType : "json",//数据格式
        type : "post",//请求方式
        async : false,//是否异步请求
        data:{
            ftName: 'QDII'
        },
        success : function(data) {   //成功返回数据
            mySum10=data;
        }
    });
    option = {
        title: {
            text: '基金类型',
            left: 'center'
        },
        tooltip: {
            trigger: 'item'
        },
        legend: {
            orient: 'vertical',
            left: 'left',
        },
        series: [
            {
                name: '访问来源',
                type: 'pie',
                radius: '50%',
                data:[
                    {value: mySum1, name: '股票型'},
                    {value: mySum2, name: '混合型'},
                    {value: mySum3, name: '封闭式'},
                    {value: mySum4, name: '指数型'},
                    {value: mySum5, name: '债券型'},
                    {value: mySum6, name: '货币型'},
                    {value: mySum7, name: '理财型'},
                    {value: mySum8, name: '保本型'},
                    {value: mySum9, name: '结构型'},
                    {value: mySum10, name: 'QDII'},
                ],
                emphasis: {
                    itemStyle: {
                        shadowBlur: 10,
                        shadowOffsetX: 0,
                        shadowColor: 'rgba(0, 0, 0, 0.5)'
                    }
                }
            }
        ]
    };
    option && myChart.setOption(option);
</script>
</script>
